<template>
    <div class="mod-appversion">
        <el-form :inline="true" :model="dataForm" @keyup.enter.native="getDataList()">
            <el-form-item>
                <el-input v-model="dataForm.name" placeholder="app中文名称" clearable></el-input>
            </el-form-item>
            <el-form-item>
                <el-button @click="getDataList()">{{ $t('handle.search') }}</el-button>
                <el-button v-if="isAuth('ic:app-version:save')" type="primary" @click="addOrUpdateHandle()">{{ $t('handle.add') }}</el-button>
                <el-button v-if="isAuth('batch:delete')" type="danger" @click="deleteHandle()" :disabled="dataListSelections.length <= 0">{{ $t('handle.batchDelete') }}</el-button>
            </el-form-item>
        </el-form>
        <el-table
            :data="dataList"
            border
            v-loading="dataListLoading"
            @selection-change="selectionChangeHandle"
            style="width: 100%;">
            <el-table-column
                type="selection"
                header-align="center"
                align="center"
                width="50">
            </el-table-column>
            <el-table-column
                v-if='show'
                prop="id"
                header-align="center"
                align="center"
                width="80"
                label="ID">
            </el-table-column>
            <el-table-column
                type="index"
               :label="$t('tabble.No')"
                width="50"
                :index="indexMethod">
            </el-table-column>
            <el-table-column
                prop="name"
                header-align="center"
                align="center"
                label="中文名称">
            </el-table-column>
            <el-table-column
                prop="fileName"
                header-align="center"
                align="center"
                label="文件名">
            </el-table-column>
            <el-table-column
                prop="verNo"
                header-align="center"
                align="center"
                label="版本号">
            </el-table-column>
            <el-table-column
                prop="type"
                header-align="center"
                align="center"
                label="系统类型">
                <template slot-scope="scope">
                    <span>{{typeFilter(scope.row.type)}}</span>
                </template>
            </el-table-column>
            <el-table-column
                prop="downloadType"
                header-align="center"
                align="center"
                label="下载类型">
                <template slot-scope="scope">
                    <span>{{downloadTypeFilter(scope.row.downloadType)}}</span>
                </template>
            </el-table-column>
            <el-table-column
                prop="downloadUrl"
                header-align="center"
                align="center"
                label="下载路径"
                :show-overflow-tooltip="true">
            </el-table-column>
            <el-table-column
                prop="forceFlag"
                header-align="center"
                align="center"
                label="强制更新">
                <template slot-scope="scope">
                    <span>{{forceFlagFilter(scope.row.forceFlag)}}</span>
                </template>
            </el-table-column>
            <!-- <el-table-column
                prop="updateDetails"
                header-align="center"
                align="center"
                label="更新内容">
            </el-table-column> -->
            <el-table-column
                prop="sort"
                header-align="center"
                align="center"
                :label="$t('tabble.sort')">
            </el-table-column>
            <el-table-column
                fixed="right"
                header-align="center"
                align="center"
                width="150"
                :label="$t('handle.handle')">
                <template slot-scope="scope">
                <el-button  v-if="isAuth('ic:app-version:update')" type="text" size="small" @click="addOrUpdateHandle(scope.row.id)">{{ $t('handle.update') }}</el-button>
                <el-button v-if="isAuth('ic:app-version:delete')" type="text" size="small" @click="deleteHandle(scope.row.id)">{{ $t('handle.delete') }}</el-button>
                </template>
            </el-table-column>
        </el-table>
        <el-pagination
            @size-change="sizeChangeHandle"
            @current-change="currentChangeHandle"
            :current-page="pageIndex"
            :page-sizes="[10, 20, 50, 100]"
            :page-size="pageSize"
            :total="totalPage"
            layout="total, sizes, prev, pager, next, jumper">
        </el-pagination>
            <!-- 弹窗, 新增 / 修改-->
    <add-or-update v-if="addOrUpdateVisible" ref="addOrUpdate" @refreshDataList="getDataList"></add-or-update>
    </div>
</template>
<script>
  import AddOrUpdate from './appVersion-add-or-update'
  import { isAuth } from '@/utils'
export default {
    data(){
        return {
            typeDicts: [],
            typeDictType: {1: 'android端'},
            downloadTypeDicts: [],
            downloadTypeDictType: {1: '官网下载'},
            forceFlagDicts: [],
            forceFlagDictType: {1: '是'},
            show: false,
            dataForm: {
                name: ''
            },
            dataList: [],
            pageIndex: 1,
            pageSize: 10,
            totalPage: 0,
            dataListLoading: false,
            dataListSelections: [],
            addOrUpdateVisible: false
        }
    },
    computed: {
        typeFilter(){
            return function(type){
                return this.typeDictType[type]
            }
        },
        downloadTypeFilter(){
            return function(type){
                return this.downloadTypeDictType[type]
            }
        },
        forceFlagFilter(){
            return function(type){
                return this.forceFlagDictType[type]
            }
        }
    },
    created(){
        this.getType()
        this.getDownloadType()
        this.getForceFlag()
    },
     // 引入的组件
    components: {
      AddOrUpdate
    },
    // 一进页面就加载
    activated(){
        this.getDataList()
    },
    methods: {
        getForceFlag(){
            this.$http({
            url: 'dg-ic/ic/dict/type/yes_or_no_status',
            method: 'get'
            }).then(({data})=>{
                if(data && data.code === 0){
                this.forceFlagDicts = data.data;
                for(let i = 0; i < data.data.length; i++){
                    this.forceFlagDictType[data.data[i].value] = data.data[i].label;
                };
                }
            })
        },
        getDownloadType(){
            this.$http({
            url: 'dg-ic/ic/dict/type/download_type',
            method: 'get'
            }).then(({data})=>{
                if(data && data.code === 0){
                this.downloadTypeDicts = data.data;
                for(let i = 0; i < data.data.length; i++){
                    this.downloadTypeDictType[data.data[i].value] = data.data[i].label;
                };
                }
            })
        },
        getType(){
            this.$http({
            url: 'dg-ic/ic/dict/type/app_type',
            method: 'get'
            }).then(({data})=>{
                if(data && data.code === 0){
                this.typeDicts = data.data;
                for(let i = 0; i < data.data.length; i++){
                    this.typeDictType[data.data[i].value] = data.data[i].label;
                };
                }
            })
        },
        indexMethod(index){
            return index+1;
        },
         // 多选
        selectionChangeHandle(val){
            this.dataListSelections = val
        },
         // 每页数
        sizeChangeHandle(val){
            this.pageSize = val
            this.pageIndex = 1
            this.getDataList()
        },
         // 当前页
        currentChangeHandle(val){
            this.pageIndex = val
            this.getDataList()
        },
        // 新增/修改
        addOrUpdateHandle(id){
            this.addOrUpdateVisible = true
            this.$nextTick(()=>{
                this.$refs.addOrUpdate.init(id,this.typeDicts,this.downloadTypeDicts,this.forceFlagDicts)
            })
        },
        // 获取列表
        getDataList(){
            this.dataListLoading = true
           this.$http({
               url: '/dg-ic/ic/app-version/list',
               method: 'get',
               params: this.$http.adornParams({
                'page': this.pageIndex,
                'limit': this.pageSize,
                'name': this.dataForm.name
                })
           }).then(({data})=>{
               if(data && data.code === 0){
                   this.dataList = data.data.list
                   this.totalPage = data.data.totalCount
               }else{
                   this.dataList = []
                   this.totalPage = 0
               }
               this.dataListLoading = false
           })
        },
        // 删除
        deleteHandle(id){
             var ids = id ? [id] : this.dataListSelections.map(item=>{
              return item.id
            })
            this.$confirm(`确定对[id=${ids.join(',')}]进行[${id ? '删除' : '批量删除'}]操作?`,'提示',{
            confirmButtonText: '确定',
            cancelButtonText: '取消',
            type: 'warning'
            }).then(()=>{
                this.$http({
                    url: `dg-ic/ic/app-version/delete`,
                    method: 'delete',
                    data: this.$http.adornData(ids,false)
                }).then(({data})=>{
                    if(data && data.code === 0){
                    this.$message({
                        message: '删除成功',
                        type: 'success',
                        duration: 1500,
                        onClose: ()=>{
                        this.getDataList()
                        }
                    })
                }
                })
            }).catch(()=>{})
        }
    }
}
</script>
